<?php
/**
 * Created by PhpStorm.
 * User: Administrator
 * Date: 2015/12/23 0023
 * Time: 上午 9:23
 */
?>
<html>
<head>
    <title>黄金价格趋势</title>
    <script src="../my.js"></script>
    <script>

        var myXmlHttpRequest;
        function updateGoldPrice(){
            myXmlHttpRequest=getXmlHttpObject();
            if(myXmlHttpRequest){
                //创建ajax引擎成功
                var url="goldPricePro.php";
                var data="city[]=dj&city[]=tw&city[]=ld";

                myXmlHttpRequest.open("post",url,true);
                myXmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
                myXmlHttpRequest.onreadystatechange=function chuli(){
                    //接收数据json
                    if(myXmlHttpRequest.readyState==4 && myXmlHttpRequest.status==200){
                        //取出数据，进程处理
                        var rse_objects=eval("(" +myXmlHttpRequest.responseText+")");
                        $('dj').innerText=rse_objects[0].price;
                        $('tw').innerText=rse_objects[1].price;
                        $('ld').innerText=rse_objects[2].price;
                        $('dj1').innerText=rse_objects[0].price-1000;
                        $('tw1').innerText=rse_objects[1].price-1000;
                        $('ld1').innerText=rse_objects[2].price-1000;
                    }
                }
                myXmlHttpRequest.send(data);
            }
        }

        //使用定时器每隔5秒发送
        window.setInterval("updateGoldPrice()",5000);
    </script>
</head>
<body>
    <center>
        <h1>每隔5秒更新数据（以1000位基数计算涨跌）</h1>
        <table border="1px solid red">
            <tr><td>市场</td><td>最新价格$</td><td>涨跌</td></tr>
            <tr><td>伦敦</td><td id="ld">788.7</td><td id="ld1">-211.3</td></tr>
            <tr><td>台湾</td><td id="tw">854.0</td><td id="tw1">-146.0</td></tr>
            <tr><td>东京</td><td id="dj">1791.3</td><td id="dj1">791.3</td></tr>
        </table>
    </center>
</body>
</html>